import React, {Component} from 'react';
import './index.less';
import {high, createPage, ajax, base, getUrlParam, toast} from 'nc-lightapp-front';
import MainTable from "../components/MainTable";
import AddNew from "../components/AddNew"
import Header from "../components/Header";
import SearchModal from "../components/SearchModal";
import updateButtonStatus    from "../container/functions/updateButtonStatus";
import getMainTableData from "../container/functions/getMainTableData";
import clearMainTableData    from "./functions/clearMainTableData";
import initCardForm from "./functions/initCardForm";
import getOneDisputedInfo from "./functions/getOneDisputedInfo";
import setButtonStatus from "./functions/setButtonStatus";
import handlePK from "./functions/handlePK";
import handleAllpks from "./functions/handleAllpks";
import deleteDisputedData from "./functions/deleteDisputedData";
import editDisputedAction from "./functions/editDisputedAction";
import FileUpload from '../../../public/components/FileUpload';
class DisputedRecord extends Component {
    constructor(props) {
        super(props);
        if (props.use) {
            props.use.form('detail')
            props.use.editTable('disputedlist')
            props.use.search('search')
        }
        this.config = {
            pagecode: '60110317p',
            appcode: '60110317'
        };
        this.state = {
            orgVal: {},
            json: {},
            searchModalValue: {},
            stopModalVisible: false,
            stopPkOpinions: '',
            queryOid: '',
            pageInfo: {
                pageSize: 10,
                pageIndex: 0,
                total: 0,
                totalPage: 1
            },
            hasSearchedOrg: true,
            currentSelectTreeNode: '',
            deleteConfirmModalVisible: false,
            pk_workdispute:null,
            page: 'main',
            disabledAll: false,
            uploadRef: null
        };
        props.createUIDom(this.config, (data) => {
            let dataItems = data.template['disputedlist'].items;
            this.initMeta(dataItems,this, data.button);
            this.setState({
                buttons: data.button || [],
                context: data.context || {},
                queryOid: data.template.search.oid
            });
            // 给劳动争议编号添加超链接
            data.template['disputedlist'].items.forEach((item, key) => {
                if (item.attrcode === 'vcode') {
                    item.renderStatus = 'browse'
                    item.render = (text, record, index) => {
                        return (
                            <span style={{color: '#007ace', cursor: 'pointer'}}
                                  onClick={() =>{this.checkDetail(record)}}>
                               {record && record.values['vcode'] && record.values['vcode'].value}
                          </span>
                        );
                    };
                }
            });
            props.meta.setMeta(data && data.template ? data.template : {});
            props.button.setButtons(data && data.button ? data.button : {});
            updateButtonStatus.call(this);
            this.setButtonStatus(this.state.page,this.state.orgVal);
        });
       
        this.updateState = this.updateState.bind(this);
        this.getMainTableData = this.getMainTableData.bind(this);
        this.toggleModal = this.toggleModal.bind(this);
        this.updateOrgValue = this.updateOrgValue.bind(this);
        this.initCardForm = this.initCardForm.bind(this);
        this.getOneDisputedInfo = this.getOneDisputedInfo.bind(this);
        this.updateButtonStatus = this.updateButtonStatus.bind(this);
    }

    initMeta(data,opt, buttonStg){
        let { json, uploadRef } = this.state;
        let isFile = buttonStg.filter(item => item.key === 'file') 
        isFile.length > 0 &&  data.push({
            attrcode: 'opr',
            itemtype: 'customer',
            hyperlinkflag: false,
            label: json['cm6011-000146'], /* 国际化处理： 附件管理*/
            width: '80px',
            textAlign: 'center',
            visible: true,
            fixed: 'right',
            render: (text, record, index) => {
                return (
                    <a style={{cursor: 'pointer'}}>
                        <i className="icon iconfont icon-fujianshenpi" onClick={() => {
                            uploadRef.showUploader(record.values.pk_workdispute.value);
                        }}/>
                    </a>
                )
            }
        })
        data.push({
            attrcode: 'handleArea',
            itemtype: 'customer',
            hyperlinkflag: false,
            label: json['cm6011-000064'],
            width: '180px',
            textAlign: 'center',
            visible: true,
            fixed: 'right',
            render(text, record, index) {
                return (
                    <div>
                        <span style={{color: '#0073E1', cursor: 'pointer',marginRight: '12px'}}
                            onClick={() =>{opt.updateDisputedData(record)}}>
                            {json['cm6011-000067']}
                        </span>
                        <span style={{color: '#0073E1', cursor: 'pointer',marginRight: '12px'}}
                            onClick={() =>{opt.deleteDisputedData(record)}}>
                            {json['cm6011-000065']}
                        </span>
                    </div>
                )
            }
        });
    }

    //更新按钮状态
    updateButtonStatus() {
        updateButtonStatus.call(this);
    }

    componentWillMount() {
        this.props.MultiInit.getMultiLang({
            moduleId: 'cm6011',
            domainName: 'hrcm',
            callback: (json, status, inlt) => {
                if (status) {
                    this.setState({json, inlt}); //存json和inlt到页面state中并刷新页面
                }
            }
        });
    }

    // 删除单据
    deleteDisputedData(record) {
        handlePK.set(record.values.pk_workdispute.value)
        deleteDisputedData.call(this, () => {
            this.props.editTable.deleteTableRowsByRowId('disputedlist',record.rowid);
            handleAllpks.remove(handlePK.get())
            handlePK.remove();
        });
    }

    // 修改单据
    updateDisputedData(record){
        let pk_workdispute = record.values.pk_workdispute.value;
        let { orgVal } = this.state;
        handlePK.set(pk_workdispute);
        editDisputedAction(orgVal,pk_workdispute,()=>{
            this.updateState({
                page: 'edit'
            }, () => {
                setButtonStatus.call(this, 'edit');
                this.initCardForm();
            });
        });
    }

    componentDidMount() {
        if (window.location.href.match('localhost:3006')){
            window.location.hash = '?page=2019823135927121'
        }
    }

    checkDetail(record) {
        handlePK.set(record.values.pk_workdispute.value)
        this.updateState({
            page: 'detail'
        }, () => {
            setButtonStatus.call(this, 'afterSave',this.state.orgVal);
            this.initCardForm();
        });

    }

    initCardForm(param) {
        initCardForm.call(this,param);
    }

    getOneDisputedInfo() {
        getOneDisputedInfo.call(this);
    }

    setButtonStatus(page,orgVal) {
        setButtonStatus.call(this,page,orgVal);
    }

    updateOrgValue(value) {
        this.setState({
            orgVal: value,
            currentSelectTreeNode: ''
        }, () => {
            if (!value.refpk) {
                clearMainTableData.call(this);
            } else {
                this.getMainTableData();
            }
        })
        this.setButtonStatus(this.state.page,value);
    }

    updateState(data, callback = () => {
    }) {
        this.setState(data, callback)
    }

    getMainTableData() {
        getMainTableData.call(this);
    }

    // 切换各种弹窗显示隐藏，type为弹窗的显示隐藏state的key值
    toggleModal(type, visible) {
        return toggleModal.call(this, type, visible);
    }

    //左侧树节点选择回调
    selectTree(pk) {
        const {pageInfo, hasSearched} = this.state;
        this.setState({
            currentSelectTreeNode: pk,
            pageInfo: {
                ...pageInfo,
                pageIndex: 0
            }
        }, () => {
            if (hasSearched) {
                this.getMainTableData();
            }
        });
    }

    goBackToMainPage() {
        this.setState({
            page: 'main'
        }, () => {
            if (this.state.hasSearched) {
                this.getMainTableData();
            }
        });
    }

    render() {
        const {button,editTable } = this.props;
        const {orgVal, pageInfo, page,hasSearched,pk_workdispute,json,queryOid} = this.state;
        return (
            <div className='entry-staff-query nc-single-table nc-bill-card'>
                <Header {...this.props}
                        json={json}
                        orgVal={orgVal}
                        uploadRef={this.state.uploadRef}
                        page={page}
                        hasSearched={hasSearched}
                        pageInfo={pageInfo}
                        updateState={this.updateState}
                        initCardForm={this.initCardForm}
                        getMainTableData={this.getMainTableData}
                        getOneDisputedInfo={this.getOneDisputedInfo}
                        updateOrgValue={this.updateOrgValue}/>
                    <div className="entry-staff-query-content nc-bill-table-area" style={{display: page === 'main' ? '' : 'none'}}>
                        <MainTable
                            {...this.props}
                            json={json}
                            updateState={this.updateState}
                            getMainTableData={this.getMainTableData}
                            pageInfo={pageInfo}
                            initCardForm={this.initCardForm}
                            pk_workdispute={pk_workdispute}
                            orgVal={orgVal}
                        />
                    </div>
                    <div className="entry-staff-query-content" style={{display: page === 'detail' ||page === 'add' || page === 'edit' ? '' : 'none'}}>
                        <AddNew {...this.props}  json={json}
                                page={page} orgVal={orgVal} pk_workdispute={pk_workdispute}/>
                    </div>
                    <FileUpload json={json} ref={node => this.state.uploadRef = node}/>
                <SearchModal
                    {...this.props}
                    queryOid={queryOid}
                    updateState={this.updateState}
                    getMainTableData={this.getMainTableData}
                />

            </div>
        );
    }
}

export default DisputedRecord;
